<!--
* @Description: DatetimePickerPopup.vue 时间日期了选择器
* @Author: 王燕欣
* @Date: 2024-10-08 14:09
-->
<template>
  <van-popup v-model="showDatePopup" position="bottom">
    <van-datetime-picker v-model="currentDateVal" type="date" title="选择年月日" :min-date="minDate" :max-date="maxDate" @confirm="onConfirm" @cancel="onCancel" @change="onChange" />
  </van-popup>
</template>

<script>

import dayjs from "dayjs";
export default {
  name: "DatetimePickerPopup",
  props: {

  },
  data() {
    return {
      showDatePopup: false,
      currentDateVal: dayjs().format("YYYY-MM-DD"),
      minDate: new Date(2020, 0, 1),
      maxDate: new Date(),
    };
  },
  created() { },

  mounted() { },
  watch: {},
  methods: {
    /**
     * @Description: 显示选择时间区间
     * @Author: 王燕欣
     * @Date: 2024-10-08 14:52
     */
    showModule(prames) {
      console.log('prames-----', prames);
      this.currentDateVal = new Date(dayjs(prames).format("YYYY-MM-DD"));

      console.log('this.currentDateVal-----', this.currentDateVal);
      this.$nextTick(() => {
        this.showDatePopup = true;
      });
    },
    /**
     * @Description: 确认选择区域时间 返回给父组件
     * @Author: 王燕欣
     * @Date: 2024-10-08 14:50
     */
    onConfirm() {
      //   console.log(`当前值：${value}, 当前索引：${index}`);
      this.$emit("onConfirm", this.currentDateVal);
      this.showDatePopup = false;
    },
    onChange() {
      //   console.log(`当前值：${value}, 当前索引：${index}`);
      this.$emit("onChange", this.currentDateVal);
    },
    /**
     * @Description: 取消选择时间
     * @Author: 王燕欣
     * @Date: 2024-10-08 14:52
     */
    onCancel() {
      this.$emit("onCancel");
      this.showDatePopup = false;
    },
    
  },
};
</script>

<style lang="scss" scoped>
</style>

